<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!--

Morpheme
Copyright (C) 2012 Francisco Monteiro

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

http://code.google.com/p/morpheme-tumblr-theme/

-->
<html>
	<head>
		<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script><!--
		<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
		<script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>-->
		<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
			{
				"parsetags": "explicit"
			}
		</script>

		<script type="text/javascript" src="morpheme-lib.js"></script>
		<script type="text/javascript" src="morpheme-extension-lib.js"></script>

		<meta name="description" content="morpheme - Tumblr Theme and Viewer" />
		<link id="linkAvatarMorpheme" rel="shortcut icon" href="http://api.tumblr.com/v2/blog/morphemetheme.tumblr.com/avatar/16" />
		<title id="pageTitleMorpheme">Morpheme</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		<style type="text/css">
			html,
			body {
				font-family: Arial, Verdana, Helvetica, sans-serif;
				color: #000000;
				background: #ffffff;
			}

			hr {
				border-right-width: 0px;
				border-left-width: 0px;
				border-top-width: 1px;
				border-bottom-width: 0px;
			}
			img {
				border-width: 0px;
				border: 0px;
			}

			a {
				/* safer for touch screen devices, should be unerline */
				/*text-decoration: underline;*/

				text-decoration: none;

				color: #c00000;
			}
			a:hover {
				text-decoration: underline;
				color: #e00000;
			}





			.overlayMorpheme {
				display: none;
				position: absolute;
				left: 0px;
				width: 100%;
				height: 100%;
				background: black;
				color: white;
			}

																											.PostPageMorpheme {
																												display: inline;
																												overflow: hidden;
																											}

			.tableCenterMorpheme {
				margin-left: auto; 
				margin-right: auto;
			}

			.headTextMorpheme,
			.buttonMorpheme {
				display: inline-block;
				padding: 5px 10px;
				margin-top: 4px;
				margin-left: 4px;
				margin-bottom: 4px;
				font-size: 15px;
				font-weight: bold;
				text-decoration: none;
			}
			.buttonMorpheme {
				background-color: #ffffff;
				border: 1px solid #e0e0e0;
				color: #c00000;
				cursor: pointer;
			}
			.buttonMorpheme:hover {
				color: #cc0000;
				text-decoration: none;
				background-color: #f0f0f0;
			}
			.buttonMorpheme:active {
				position: relative;
				top: 1px;
			}

			.headTextMorpheme,
			.buttonMorpheme.smallMorpheme {
				font-size: 72%;
			}
			.buttonMorpheme.smallMorpheme {
				padding: 3px 7px;
			}
			.headTextMorpheme {
				padding: 3px 0px 3px 3px;
			}

			.buttonMorpheme.smallMorpheme:hover {
				background-position: 0 -50px;
			}
			.buttonMorpheme.smallMorpheme:active {
				padding: 4px 7px 2px;
				background-position: 0 top;
			}
			.buttonMorpheme.largeMorpheme {
				font-size: 125%;
				padding: 7px 12px;
			}
			.buttonMorpheme.largeMorpheme:hover {
				background-position: 0 -35px;
			}
			.buttonMorpheme.largeMorpheme:active {
				padding: 8px 12px 6px;
				background-position: 0 top;
			}

			.postMorpheme {
				border: 1px;
				border-style: solid;
				border-color: #e0e0e0 #c0c0c0 #c0c0c0 #e0e0e0;
				color: #000000;
				vertical-align: top;
				margin-left: 4px;
				margin-right: 4px;
				margin-top: 4px;
			}
			.postMorphemeCursor {
				border-color: #e00000;
			}

			.headPostMorpheme {
				display: inline-block;
				overflow: hidden;
				width: 100%;
			}

			.bodyPostMorpheme {
				display: inline-block;
				overflow: hidden;
				vertical-align: middle;
				text-align: center;
				width: 100%;
			}

			.captionPostMorpheme {
				display: inline-block;
				overflow: hidden;
				font-size: 100%;
			}

			.tagsPostMorpheme {
				display: inline-block;
				overflow: hidden;
				vertical-align: middle;
				text-align: center;
				width: 100%;
			}

			/*.headPostMorpheme img {
				vertical-align: middle;
				text-align: center;
				margin-left: 0px;
				margin-right: 0px;
			}*/
			.headPostMorpheme iframe,
			.headPostMorpheme a {
				display: inline-block;
			}

			.postMorpheme.inlineMorpheme {
				border-width: 1px 1px 1px 1px;
				display: inline-block;
				margin-bottom: 4px;
				padding: 4px;
				font-size: 75%;
			}

			.postMorpheme.inlineMorpheme,
			.captionPostMorpheme.inlineMorpheme {
				width: 260px;
			}

			.bodyPostMorpheme.inlineMorpheme img {
				max-width: 260px;
				max-height: 390px;
			}

			.postMorpheme.blockMorpheme {
				border-width: 1px 2px 2px 1px;
				display: block;
				margin-bottom: 20px;
				padding: 16px;
				font-size: 90%;
			}

			.postMorpheme.blockMorpheme,
			.captionPostMorpheme.blockMorpheme {
				width: 600px;
			}


			#divShortcutsMorpheme {
				position: absolute;
				top: 30px;
				right: 0px;

				white-space: nowrap;
				font-size: 72%;


				margin: 0px;
				padding: 4px;

				border: 1px solid transparent;

				text-align: right;
			}
			#divShortcutsMorpheme ul {
				margin: 0px;
				padding: 0px;
			}
			#divShortcutsMorpheme li {
				list-style-type: none;
			}
			#divShortcutsMorpheme li ul {
				width: 320px;
				text-align: left;
			}
			#divShortcutsMorpheme li ul li {
				margin: 4px;
				padding: 0px;
			}

			#divShortcutsMorpheme li ul {
				display: none;
			}
			#divShortcutsMorpheme li span:hover + ul,
			#divShortcutsMorpheme li ul:hover {
				display: block;
				border: 1px solid black;
				background-color: lightgray;

			}
			#divShortcutsMorpheme hr {

			}


			.suggestionIconsMorpheme {
				display: inline-block;
				width: 64px;
				height: 64px;
				background-color: lightgray;
			}
		</style>
	</head>
	<body id="bodyMorpheme" style="height: 100%;">
		<span id="spanPopupMorpheme"></span>
		<span id="spanMenuMorpheme"></span>

		<table border="0" cellspacing="4" cellpadding="4" class="tableCenterMorpheme">
			<tr id="suggestionsMorpheme" style="display: none; visibility: hidden;">
				<td style="text-align: center;">
					<span style="text-align: center; width: 100%;">
						<span onload="javascript:alert(1);">Morpheme - tumblr theme and viewer</span>
						<br />
						<br />

						<span>
							<input
								onfocus="javascript:if(this.value=='type tumblr name'){this.value=''};"
								onblur="javascript:if(this.value==''){this.value='type tumblr name';};"
								type="text"
								value="type tumblr name" />
							<span
								onclick="javascript:window.location='?url=' + this.parentNode.getElementsByTagName('input')[0].value + '&inline=true';"
								class="buttonMorpheme smallMorpheme">load</span>
						</span>

						<br />
						<br />

						or try some of these
						<br />
						<br />

						<a
							class="suggestionIconsMorpheme"
							title="acarro"
							href="?url=http://acarro.tumblr.com&inline=true"><img
							src="http://api.tumblr.com/v2/blog/acarro.tumblr.com/avatar/64" /></a>

						<a
							class="suggestionIconsMorpheme"
							title="refugado"
							href="?url=http://refugado.tumblr.com&inline=true"><img
							src="http://api.tumblr.com/v2/blog/refugado.tumblr.com/avatar/64" /></a>

<!--
						<a
							class="suggestionIconsMorpheme"
							title="minusculus"
							href="?url=http://minusculus.tumblr.com&inline=true"><img
							src="http://api.tumblr.com/v2/blog/minusculus.tumblr.com/avatar/64" /></a>

						<a
							class="suggestionIconsMorpheme"
							title="algibeira"
							href="?url=http://algibeira.tumblr.com&inline=true"><img
							src="http://api.tumblr.com/v2/blog/algibeira.tumblr.com/avatar/64" /></a>

						<a
							class="suggestionIconsMorpheme"
							title="refugo"
							href="?url=http://refugo.tumblr.com&inline=true"><img
							src="http://api.tumblr.com/v2/blog/refugo.tumblr.com/avatar/64" /></a>

						<a
							class="suggestionIconsMorpheme"
							title="uminuscula"
							href="?url=http://uminuscula.tumblr.com&inline=true"><img
							src="http://api.tumblr.com/v2/blog/uminuscula.tumblr.com/avatar/64" /></a>
-->

					</span>
					<br />
					<br />


					<span style="text-align: left; font-size: 72%;">
						main features:
						<ul>
							<li>link to Google Images and <span>Tin</span>Eye on photo posts to search for credit or any other info regarding the photo<br /><br /></li>
							<li>use post tags to search related content on Google and Tumblr<br /><br /></li>
							<li>the Theme can be used as a Viewer for other tumblrs, like this:<br />http://morphemetheme.tumblr.com/?url=acarro<br /><br /></li>
							<li>the Theme works with javascript enabled or not (so search engines will index content easily), however these require javascript to work:<br /><br />
								<ul>
									<li>endless scrolling<br /><br /></li>
									<li>quick reblog and like with no need to visit the post<br /><br /></li>
									<li>keyboard shortcuts<br /><br /></li>
								</ul>
							</li><li>easily change theme from archive icon like viewer to large one post per line<br /><br /></li>
							<li>open source project, distributed under the permissive <a href="http://www.opensource.org/licenses/mit-license.php">MIT License</a><br /><br /></li>
						</ul>
					</span>
					<br />
					<br />

				</td>
			</tr>
			<tr>
				<td>
					<table border="0" cellspacing="0" cellpadding="0" width="100%">
						<tr>
							<td id="tableCellAvatar1Morpheme" rowspan="2">
								<a 
									id="anchorHome1Morpheme"><img 
									id="imageAvatarMorpheme" /></a>
							</td>
							<td id="tableCellAvatar2Morpheme" rowspan="2">&nbsp;&nbsp;&nbsp;&nbsp;</td>
							<td>
								<a id="anchorHome2Morpheme">
									<h3 id="headerTitleMorpheme"></h3>
								</a>
							</td>
						</tr>
						<tr>
							<td id="tableCellDescriptionMorpheme" style="width: 100%;" />


						</tr>
					</table>
				</td>
			</tr>
			<tr><td id="postDumperMorpheme" /></tr>
			<tr>
				<td>
					<input
						type="button"
						id="loadButtonMorpheme"
						value=""
						class="buttonMorpheme largeMorpheme"
						style="width: 99%;"
						onclick="javascript:if (Morpheme.loadPosts()) { MyExtension.utils.button.setButtonState(false, false, false, true); }"
						disabled="disabled" />
				</td>
			</tr>
		</table>

		<script type="text/javascript">
			MyExtension.load({
				// NON optional configs
				pageTitle: 'pageTitleMorpheme',
				linkAvatar: 'linkAvatarMorpheme',
				loadButton: 'loadButtonMorpheme',
				divPopup: 'divPopupMorpheme',
				tablePopup: 'tablePopupMorpheme',
				spanMessage: 'spanMessageMorpheme',
				spanPrevious: 'spanPreviousMorpheme',
				spanNext: 'spanNextMorpheme',
				spanExit: 'spanExitMorpheme',
				tableCellAvatar1: 'tableCellAvatar1Morpheme',
				tableCellAvatar2: 'tableCellAvatar2Morpheme',
				imageAvatar: 'imageAvatarMorpheme',
				anchorHome1: 'anchorHome1Morpheme',
				anchorHome2: 'anchorHome2Morpheme',
				headerTitle: 'headerTitleMorpheme',
				tableCellDescription: 'tableCellDescriptionMorpheme',
				postDumper: 'postDumperMorpheme',
				body: 'bodyMorpheme',
				suggestions: 'suggestionsMorpheme',
				spanPopup: 'spanPopupMorpheme',
				spanMenu: 'spanMenuMorpheme',
				divShortcuts: 'divShortcutsMorpheme',


				// optional configs
				inline: false,
				showAvatar: true,

				showDate: true,
				showDateInline: false,
				showGoogleImageSearch: true,
				showGoogleImageSearchInline: true,
				showTinEyeImageSearch: true,
				showTinEyeImageSearchInline: true,
				showViewHRImage: true,
				showViewHRImageInline: false,
				showSource: true,
				showSourceInline: true,
				showTags: true,
				showTagsInline: true,
				showTagSearchGoogle: true,
				showTagSearchTumblrGoogle: true,
				showTagSearchTumblr: true,
				skipTagSearchFor: 'unknown|about|faq|ask|photo|video|music',
				showPostType: true,
				showPostTypeInline: true,
				showPostTypeFilter: true,

				blockScripts: true,
				showPlayers: false,

				postsPerLoad: 16 // this should match the posts per page you've configured for your tumblr (only if you're running this as a tumblr theme)
			});

			if (false) {

/*
function SomeClass () {
	var privar = 0;
	var privmethod = function() {
		// do whatever...
	};

	this.add = function() {
		privar++;
	};

	this.show = function() {
		return privar;
	};
};

var test = new SomeClass();
alert(test.show());
test.add();
alert(test.show());
*/

				Morpheme.utils.tumblrAPIv2.initialize({
					key: "uRuNCDtWApVjX0JLnfezWWj9acR7ZIUxkjsFcCpWiLACNc0rNw",
					url: "acarro.tumblr.com"
				});
				//alert(Morpheme.utils.tumblrAPIv2.config.key);
				//alert(Morpheme.utils.tumblrAPIv2.config.url);
				var url =
					Morpheme.utils.tumblrAPIv2.load.posts(
						function(error) {
alert(url);
							switch(error) {
								case 0:
									if (Morpheme.utils.tumblrAPIv2.read.posts != null) {
										alert(Morpheme.utils.tumblrAPIv2.read.posts.response.posts[0].id);
									}
									break;
								default:
									alert("error: " + error);
									break;
							}
						},
						2000,
						//type, id, tag, limit, offset, format
						null, null, null, 16, 0, 'raw'
					);
				//alert(url);
			}

		</script>
	</body>
</html>